<template>
	<view class="bg">
		<view class="content">
			<!-- <view class="">
				<view class="flx">
					<div>预约订单编号</div>
					<div>1</div>
				</view>
				<view class="">
					<view class="flx">
						<div>回收物类型名称</div>
						<div>2</div>
					</view>
					<view class="flx">
						<div>预估数目(重量)</div>
						<div>3</div>
					</view>
				</view>
				
			</view> -->
			 <!-- 表格 cellspacing内边距 cellpadding外边距-->
			    <table  cellspacing="0"
                               cellpadding="0"
                               border="0" >
			        <!-- thead表头 -->
			        <thead>
			            <tr>
			                <td>回收物品</td>
			                <td>重量</td>
			               
			            </tr>
			        </thead>    
			        <!-- tbody表体 -->
			        <tbody v-for="(item,index) in reservationData" :key="index">
			            <tr>
			                <td>{{item.typeName}}</td>
			                <td>{{item.num}}{{item.unit}}</td>
			            </tr>
			        </tbody>
			    </table>
		</view>
	</view>
</template>

<script>
	import request from '../../utils/request.js'
	export default {
		data() {
			return {
				reservationData:[
					
				],
				reservationId:''
			}
		},
		methods: {
			getReservationData() {
				let that = this
				request.get('/api/reservation/detail/list', {
					reservationId: this.reservationId,
					
				}).then(res => {
					if (res.code == 0) {
						
						this.reservationData = res.data
	                    console.log(this.reservationData, '2222211111111111111')
					}
				})
			}
		},
		onShow() {
			this.getReservationData()
		},
		onLoad(option) {
			this.reservationId = option.reservationId
			console.log(this.reservationId,'222222222')
		}
	}
</script>

<style lang="less" scoped>
	.bg{
		background-color: #F1F4F9;
		padding: 24rpx;
		height: 100vh;
		.content{
			padding: 24rpx;
			background-color: #FFFFFF;
			.flx{
				display: flex;
				justify-content: space-between;
			}
		}
	}
	h3{
		width: 100px;
		text-align: center;
	    /* 关键点,利用定位让文字居中 */
		position: relative;
		margin: 0 auto;
		bottom: 14px;
		background-color: white;
		color: #7ef805;
	}
	table {
		width: 100%;
		/* margin: 0 auto;居中 */
		margin: 0 auto;
		text-align: center;
		vertical-align: middle;
	}
	table tr td {
		width: 50%;
		height: 50px;
		border: 1rpx solid orange;
	}
</style>